Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Golem - executable APP #1216

Open
wants to merge 86 commits into
base: main
Choose a base branch
from
Open

Golem - executable APP #1216

wants to merge 86 commits into from

Conversation

itsparser
Copy link

@itsparser itsparser commented Jan 3, 2025

/claim #1189
/resolves #1189

Download - https://www.dropbox.com/scl/fi/esuyaha0yddm2pjjtocsq/Golem_0.1.0_aarch64.dmg?rlkey=a2jhyludo63eoabtw094rnsdt&st=f59q6dv1&dl=0

if you are looking for windows and linux
https://github.com/itsparser/golem/actions/runs/12619370974

Objectives

  1. Build a TypeScript-based GUI application for managing Golem components, workers, APIs, and plugins.
  2. Integrate the application into the single executable build of Golem.
  3. Provide a developer-friendly experience with polished UI/UX design.
  4. Ensure functionality supports all Golem backend APIs.

Plan

Phase 1: Core Decisions

  • Set up a Tauri + React project for single executable build
  • Choose a UI framework TailwindCSS, shadcn for consistent and modern design. (since console.golem.cloud use samesetup it is easy for developer to use it)
  • Integrate cross-platform support Tauri for bundling as an executable.
  • Set up backend API connections using Golem REST API.
  • Create a development environment with live reloading.

Phase 2: Core Features Implementation

Component Management

  • Create new components.
  • List existing components.
  • Update component versions.
  • Delete components.
  • Export components.
  • Link workers to components.
  • Display component status.
  • Manage file permissions and download components.
  • Support to add file as part of component creation and update

Worker Management

  • Provide an overview of worker information.
  • Create new workers from components.
  • Delete running workers.
  • Pause/suspend workers.
  • Invoke worker functionality.
  • Display logs of worker invocations.

API Management

  • Create new APIs.
  • Manage API versions.
  • Create and manage routes for invoking APIs.
  • Delete API versions.
  • Delete all routes.

Plugin Management

  • Create plugins.
  • List available plugins.
  • Update/version plugins.
  • Delete plugins.

Phase 3: Integration into Single Executable

  • Integrate the GUI application with the Golem CLI using Rust.
  • Bundle the GUI application into the single executable build.
  • Test cross-platform compatibility (Linux, macOS, Windows).

Phase 4: UI/UX Enhancements

  • Design a consistent and modern interface.
  • Ensure responsive design for cross-platform usability.

Phase 5: Testing and Validation

  • Conduct unit testing for each module.
  • Perform integration testing for GUI and backend APIs.
  • Validate the application on different operating systems.

Deliverables

  • Screenshots of all major UI sections.
  • Documentation for installation and usage.
  • Add GitHub Action to bundle binaries for all platforms (Linux, macOS, Windows).

Clarification Needed

  • code path - current path of /crates/app/ is it right to be here
  • Clarification on the route creation

Screenshot of major pages

Screenshot 2025-01-03 at 8 02 59 PM Screenshot 2025-01-03 at 8 03 11 PM Screenshot 2025-01-03 at 8 03 38 PM Screenshot 2025-01-03 at 8 03 50 PM Screenshot 2025-01-03 at 8 04 01 PM Screenshot 2025-01-03 at 8 04 29 PM Screenshot 2025-01-03 at 8 04 39 PM Screenshot 2025-01-03 at 8 05 23 PM Screenshot 2025-01-03 at 8 05 36 PM

@itsparser itsparser marked this pull request as ready for review January 5, 2025 12:31
@itsparser
Copy link
Author

@jdegoes its been done can you review this and share your feedback

@itsparser
Copy link
Author

@jdegoes, just a quick follow-up to check if you’ve had a chance to review the pending PR. Thank you for your time and attention.

@jdegoes
Copy link
Contributor

jdegoes commented Jan 22, 2025

@itsparser Can you send me your email, perhaps on Discord, and we can have a meeting about it?

In addition, I added a new requirement:

Getting Started

In order to test the functionality that you develop in the GUI, you must develop and deploy your own backend on Golem. In fact, this should be the FIRST thing you do in order to solve this ticket--because otherwise you will not understand how Golem works or what sort of experience is required in order to build and deploy for Golem.

The steps are as follows:

  1. Pick a programming language supported by Golem (basically, any language that can compile or be bundled to WASM Components); see https://learn.golem.cloud.
  2. Define a WIT interface for your component. I included a WIT interface for a simple TODO backend below.
  3. Implement code for your component, which satisfies the WIT-based interface. How you do this is language-specific and documented here, among other places.
  4. Deploy your component on Golem. You can use Golem single executable, Golem Cloud, or deploy Golem in the cloud.
  5. Build an API for your component. You should use one worker per user, and have APIs like the following:
    GET /{user-id}/todos/
    POST /{user-id}/todos/ 
    GET /{user-id}/todos/{todo-id}
    PUT /{user-id}/todos/{todo-id}
    DELETE /{user-id}/todos/{todo-id}
    
    Together with other APIs for user profile, getting uncompleted todos, etc.
  6. Once you test this REST API, which will be served by the Worker Gateway, you are ready to proceed to implementing the solution.

After you implement the solution, you will be able to visually complete all of the above steps, as well as diagnose and debug issues related to development, update your component, and do all other functions supported by the Golem APIs.

package todo:personal@0.1.0;

interface types {
    // Basic timestamp type (Unix timestamp in milliseconds)
    type timestamp = u64;

    // User profile information
    record profile {
        name: string,
        email: string,
        created-at: timestamp,
        updated-at: timestamp,
    }

    // Input for updating profile
    record update-profile-input {
        name: option<string>,
        email: option<string>,
    }

    // Represents a task
    record task {
        id: u64,
        title: string,
        description: string,
        completed: bool,
        due-date: option<timestamp>,
        created-at: timestamp,
        updated-at: timestamp,
    }

    // Input for creating a task
    record create-task-input {
        title: string,
        description: string,
        due-date: option<timestamp>,
    }

    // Input for updating a task
    record update-task-input {
        title: option<string>,
        description: option<string>,
        completed: option<bool>,
        due-date: option<timestamp>,
    }

    // Error types
    enum error {
        not-found,
        invalid-input,
        internal-error,
    }
}

// Profile management interface
interface profile {
    use types.{error, profile, update-profile-input};

    // Get the current user's profile
    get: func() -> result<profile, error>;

    // Update the current user's profile
    update: func(input: update-profile-input) -> result<profile, error>;
}

// Task management interface
interface tasks {
    use types.{error, task, create-task-input, update-task-input, timestamp};

    // Create a new task
    create: func(input: create-task-input) -> result<task, error>;

    // Get a specific task by ID
    get: func(id: u64) -> result<task, error>;

    // Update an existing task
    update: func(id: u64, input: update-task-input) -> result<task, error>;

    // Delete a task
    delete: func(id: u64) -> result<_, error>;

    // List all tasks
    list: func() -> result<list<task>, error>;

    // List tasks due before a specific timestamp
    list-due-before: func(before: timestamp) -> result<list<task>, error>;

    // List all completed tasks
    list-completed: func() -> result<list<task>, error>;

    // List all incomplete tasks
    list-incomplete: func() -> result<list<task>, error>;
}

// Main world definition
world todo-worker {
    import types;
    export profile;
    export tasks;
}

@itsparser
Copy link
Author

In order to test the functionality that you develop in the GUI, you must develop and deploy your own backend on Golem. In fact, this should be the FIRST thing you do in order to solve this ticket

Hi @jdegoes thanks for writing back, I have send a DM in discord to you with my email id
and about the second point

In order to test the functionality that you develop in the GUI, you must develop and deploy your own backend on Golem. In fact, this should be the FIRST thing you do in order to solve this ticket
  • So i have aready tested the application using the shopping cart sample, but as requested will do this with the TODO app as you have requested

let me know if you need anything else from me to move further on this ticket

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Create Open Source GUI for Golem in TypeScript
2 participants